var dsServicos = new Ext.data.Store({
    remoteSort: false,
    baseParams: {lightWeight:false},
    sortInfo: {field:'name', direction:'DESC'},
    autoLoad: {params:{start:0, limit:500}},

    proxy: new Ext.data.HttpProxy({
        url: 'http://localhost/cakeX/clientes/listar'
    }),

    reader: new Ext.data.JsonReader({
        root: 'data',
        totalProperty: 'total',
        idProperty: 'id',
        fields: [
            'id', 'name', 'email', 'telefone'
        ]
    })
});

var gridServicos={
    xtype: 'grid',
    title: 'Lista de serviços',
    x: 5,
    y: 250,
    width: 576,
    height: 200,
    border: true,
    ds: dsServicos,
    columns: [
        {
            xtype: 'gridcolumn',
            dataIndex: 'id',
            header: 'Id',
            sortable: true,
            width: 30
        },
        {
            xtype: 'gridcolumn',
            dataIndex: 'name',
            header: 'Nome',
            sortable: true,
            width: 200,
        },
        {
            xtype: 'gridcolumn',
            dataIndex: 'telefone',
            header: 'Telefone',
            sortable: true,
            width: 100
        },
        {
            xtype: 'gridcolumn',
            dataIndex: 'email',
            header: 'Email',
            sortable: true,
            width: 150
        }
    ],
    bbar: new Ext.PagingToolbar({
        pageSize: 25,
        store: dsServicos,
        displayInfo: true,
        displayMsg: 'Displaying topics {0} - {1} of {2}',
        emptyMsg: ""
    })
};

MyDesktop.Servicos=Ext.extend(Ext.app.Module, {
    id:'servicos-win',
    init : function(){
        this.launcher = {
            text: 'Serviços',
            iconCls:'icon-grid',
            handler : this.createWindow,
            scope: this
        }
    },

    createWindow : function(){
        var desktop = this.app.getDesktop();
        var win = desktop.getWindow('servicos-win');
        if(!win){
            win = desktop.createWindow({            		
            	id: 'servicos-win',
                title:'Serviços',
                width:600,
                height:516,
                iconCls: 'icon-grid',
                shim:false,
                animCollapse:false,
                constrainHeader:true,
                store: store,                
                layout: 'fit',
                items:
                	new Ext.FormPanel({
                        id: 'servicos-form',
                        frame: false,
                        border: false,
                        labelAlign: 'left',
                        bodyStyle:'padding:5px',
                        defaultType: 'textfield',
                        layout: 'absolute',
                        items: [
    							{
    							    xtype: 'label',
    							    x: 5,
    							    y: 5,
    							    text: 'Código:' 
    							},    
                                {
                                    xtype: 'textfield',
                                    x: 5,
                                    y: 20,
                                    name: 'codigo'
                                },
    							{
    							    xtype: 'label',
    							    x: 5,
    							    y: 45,
    							    text: 'Nome:' 
    							},    
                                {
                                    xtype: 'textfield',
                                    x: 5,
                                    y: 60,
                                    name: 'nome',
                                    width: 285
                                },
                                {
    							    xtype: 'label',
    							    x: 295,
    							    y: 45,
    							    text: 'Tipo:' 
    							},
    							{
                                    xtype: 'combo',
                                    x: 296,
                                    y: 60,
                                    name: 'tipo',
                                    width: 285
                                },
                                {
    							    xtype: 'label',
    							    x: 5,
    							    y: 85,
    							    text: 'Descrição:' 
    							},
    							{
    							    xtype: 'textarea',
    							    x: 5,
    							    y: 100,
    							    width: 576,
    							    name: 'descricao:' 
    							},
    							{
    							    xtype: 'label',
    							    x: 5,
    							    y: 165,
    							    text: 'Valor:' 
    							},
    							{
                                    xtype: 'textfield',
                                    x: 5,
                                    y: 180,
                                    name: 'valor'                                
                                },
    							{
    								xtype: 'buttongroup',
    								x: 5,
    	                			y: 215,
    	                			frame: false,
    	                            border: false,
    	                			items: [
    	                			        {
    	                			        xtype: 'button',
    	                			        text: 'Salvar',
    	                			        width: 60
    	                			        },
    	                			        {
    	                			        xtype: 'tbspacer',
    	                			        width: 5
    	                			        },
    	                			        {
    	                			        xtype: 'button',
    	                			        text: 'Cancelar',
    	                			        width: 60
        	                			    }
    	                			]    								
    							},
                                gridServicos
                        ],
                        tbar: {
                            xtype: 'toolbar',
                            items: [
                                {
                                    xtype: 'buttongroup',
                                    title: '',
                                    columns: 3,
                                    frame: false,
                                    border: false,
                                    items: [
                                        {
                                            xtype: 'button',
                                            text: 'Novo',
                                            width: 60,
                                            iconCls:'add'
                                        },
                                        {
                                            xtype: 'button',
                                            text: 'Deletar',
                                            width: 60,
                                            iconCls:'remove'
                                        }
                                    ]
                                }
                            ] 
                		}    
                	})
            	}
            );
        }   
        win.show();
    }
});
